import {View, ScrollView, Text, Image, Button} from '@tarojs/components';
import Taro from '@tarojs/taro';
import React from 'react';
import {connect} from 'react-redux';
import * as T from './types';
import './index.less';
import actions from './actions';
import {store2Props} from './selectors';
import {AtTabs, AtTabsPane} from 'taro-ui';
import 'taro-ui/dist/style/components/tabs.scss';
import AllDetails from './components/allDetails';
import GetOnly from './components/getOnly';
import OnlyUse from './components/onlyUse';

//@ts-ignore
actions().actions.loadReducer();
//@ts-ignore
@connect<Partial<T.IProps>, any>(store2Props, actions)
export default class packageIGameCurrencyDetails extends React.Component<Partial<T.IProps>, any> {
  constructor(props) {
    super(props);
    this.state = {
      current: 0,
    };
  }

  componentDidMount() {}

  componentWillUnmount() {
    this.props.actions.clean();
  }

  componentWillMount(): void {
    this.props.actions.init();
  }

  componentDidShow() {}

  handleClick(value) {
    this.setState({
      current: value,
    });
  }

  render() {
    let {current} = this.state;
    const tabList = [{title: '全部明细'}, {title: '仅获取'}, {title: '仅使用'}];
    return (
      <View className="packageIGameCurrencyDetails">
        <AtTabs scroll current={current} tabList={tabList} onClick={this.handleClick.bind(this)}>
          <AtTabsPane current={current} index={0}>
            <AllDetails />
          </AtTabsPane>
          <AtTabsPane current={current} index={1}>
            <GetOnly />
          </AtTabsPane>
          <AtTabsPane current={current} index={2}>
            <OnlyUse />
          </AtTabsPane>
        </AtTabs>
      </View>
    );
  }
}

//create by moon https://github.com/creasy2010/moon
